<template>
	<view>
		<div class="address-box">
			<view>
				<text>联系人：</text>
				<input type="text" v-model="address.name" >
			</view>
			<view>
				<text>联系电话：</text>
				<input type="number" v-model="address.phone" maxlength="11" minlength="11">
				<!-- <uni-number-box :value="address.phone"></uni-number-box> -->
			</view>
			<view>
				<text>送货地址:</text>
				<input type="text" v-model="address.dizhi" >
			</view>
			<button type="primary" @click="primary_address">提交</button>
		</div>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				address:{
					name:'',
					phone:'',
					dizhi:'',
				}
			};
		},
		methods:{
			primary_address(){
				if(this.address.name !== '' && this.address.phone !== '' && this.address.dizhi !== ''){
					const address = {
						name: this.address.name,
						phone:this.address.phone,
						dizhi:this.address.dizhi
					}
					uni.switchTab({
						url:'/pages/cart/cart'
					}),
					
					this.addToaddress(address)
				}else{
					uni.showToast({
						title:'请输入完整信息',
						duration:2000,
						icon:'none'
					})
				}
			},
			...mapMutations('m_address', ['addToaddress'])
		}
	}
</script>

<style lang="scss">
.address-box{
	display: flex;
	flex-direction: column;
	padding: 10px;
	view{
		display: flex;
		align-items: center;
		margin: 10px 0;
		text{
			font-size: 14px;
		}
		input{
			border: 1px solid #efefef;
			font-size: 12px;
			width: 70%;
		}
	}
	button{
		letter-spacing: 10px;
		text-align: center;
		font-size: 14px;
	}
}
</style>
